<%@ page contentType="text/html;charset=UTF-8" %>
<%
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+request.getContextPath()+"/";
%>
<html>

<head>
	<%@ include file="/commons/meta.jsp" %>
	<base href="<%=basePath%>">
	<title>登陆</title>
<style type="text/css">
	* {
			-webkit-box-sizing: border-box;
			   -moz-box-sizing: border-box;
			        box-sizing: border-box;
		
			margin: 0;
			padding: 0;
	}

	.screen {
		
		background-repeat: no-repeat;
		font-family: "Microsoft Yahei";
	}
	
	
	
	input {
		display: block;
		height: 38px;
		width: 340px;
	
		
		font-size: 18px;
		font-family: "Microsoft Yahei";
	
		border: 1px #fff solid;
		border-radius: 4px;
	
		outline: none;
	}
	
	.text:hover {
		background: rgba(0, 0, 0, 0.4);
	}
	.text {
		background: rgba(0, 0, 0, 0.2);
		color: #d9d8d8;
		padding-left: 45px;
	}
	.button {
		background: rgba(255, 255, 255, 0);
		color: #fff;
		margin-top: 40px;
	}
	.button:hover,
	.button:active {
		background: rgba(255, 255, 255, 0.4);
	}
	.input-child {
		position: relative;
		width: 340px;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	
	.icons {
		position: absolute;
		top: 6px;
		left: 12px;
	}
	
	.center {
		margin: 0 auto;
	}
	
	.Logo {
		color: #fff;
		margin-bottom: 40px;
		
	}
	.Logo span {
		font-size: 21px;
		padding-left: 15px;
	}
	.Logo img {
		vertical-align: bottom;
	}
</style>	
</head>

<body>
<%@ include file="/commons/messages.jsp" %>

<div  class="screen">
		<div class="input">
			<form action="account/login" method="post">
				<input type="hidden" name="redirectUrl" value="${redirectUrl}"/>
				<div class="input-child Logo">
					<img src="styles/images/fdlmLogo.png">
					<span>后台管理系统</span>	
				</div>
				<div class="input-child">
					<img src="styles/images/user.png" class="icons">
					<input type="text" name="account" class="text" placeholder="用户名">
				</div>
				<div class="input-child">
					<img src="styles/images/lock.png" class="icons">
					<input type="password" name="password" class="text" placeholder="密码">
				</div>
				<div class="input-child">
					<input type="submit" value="登录" class="button">
				</div>
			</form>
		</div>
</div>

<script>
	new Validation(document.forms[0],{onSubmit:true});
	
	
	//get the width and height of the screen

	var sWidth = $(window).width();
	var sHeight = $(window).height();

	//set the values of the class named "screen"

	$(".screen").css({"width": sWidth, 
					  "height": sHeight,
					  "background-image": "url(styles/images/2.jpg)",
					  "background-size": sWidth+"px "+sHeight+"px",
					  "-moz-background-size": sWidth+"px "+sHeight+"px",
					  "background-size": sWidth+"px "+sHeight+"px",
					  "padding-top": sHeight*0.25
					});

	//set the position of the class named "input" 

	$(".text").click ( function(){
		$(this).css("color", "#fff");
	});

</script>

</body>
</html>
